<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>欠款跟踪</title>
<%@include file="/jsp/common/inc.jsp"%>
<script type="text/javascript">
	var grid;// 欠款信息
	$(function() {
		grid = $("#grid").datagrid({
			url : "${pageContext.request.contextPath}/qkqueryController/datagrid",
			striped : true,
			rownumbers : true,
			pagination : true,
			singleSelect : true,
			fitColumns : true,
			idField : "id",
			pagesize : 10,
			pageList : [10,20,30],
			toolbar : "#toolbar",
			columns : [ [ {
				width : 100,
				title : "分店",
				field : "branch",
				formatter : function(value,rowData,rowIndex){
					return value.branchName;
				}
			},{
				width : 100,
				title : "营业日期",
				field : "tradeDate",
				formatter : function(value,rowData,rowIndex){
					return value.substr(0,10);
				}
			}, {
				width : 100,
				title : "欠款类型",
				field : "qkType",
				formatter : function(value,rowData,rowIndex){
					return value.name;
				}
			},{
				width : 100,
				title : "欠款金额",
				field : "qkAmount"
			}, {
				witdh : 100,
				title : "是否结算",
				field : "settleStatus",
				formatter : function(value,rowData,rowIndex){
					if(value == "N"){
						return "未结算";
					}else{
						return "已结算";
					}
				}
			},{
				width : 100,
				title : "结算金额",
				field : "settleAmount"
			},{
				width : 100,
				title : "结算日期",
				field : "settleDate"
			},{
				width : 100,
				title : "备注",
				field : "remark"
			}] ]

		});
	});
	$(function(){
		$("#branchId").combobox({
			url : "${pageContext.request.contextPath}/commonController/branchList",
			valueField : 'id',
			textField : 'branchName',
			width : 100,
		});
		$("#qkTypeId").combobox({
			url : "${pageContext.request.contextPath}/commonController/qktypeList",
			valueField : 'id',
			textField : 'name',
			width : 100,
		});
	});
	
	function searchFun(){
		console.info(sy.serializeObject($("#_form")));
		grid.datagrid("load",sy.serializeObject($("#_form")));
	}
	// 清空查询条件
	function clearFun(){
		$("#_form").find("input").val("");
		grid.datagrid("load",{});
	}
</script>
</head>
<body class="easyui-layout" data-options="fit:true,border:false">
	<div id="toolbar" style="display: none;">
		<form id="_form">
			<table>
				<tr>
					<td>分店</td>
					<td>
						<input id="branchId" name="branchId" />
					</td>
					<td>欠款类型</td>
					<td>
						<input id="qkTypeId" name="qkTypeId" />
					</td>
					<td><a href="#" class="easyui-linkbutton" onclick="searchFun()">查询</a></td>
					<td><a href="#" class="easyui-linkbutton" onclick="clearFun()">清空</a></td>
				</tr>
			</table>
		</form>

	</div>
	<div data-options="region:'center',fit:true,border:false">
		<table id="grid" data-options="fit:true,border:false"></table>
	</div>
</body>
</html>